import 'package:flutter/material.dart';
import 'package:online_study/theme/colors.dart';
import 'package:online_study/theme/size.dart';

//勋章
class MedalPage extends StatefulWidget {
  @override
  _MedalPageState createState() => _MedalPageState();
}

class _MedalPageState extends State<MedalPage> {
  @override
  Widget build(BuildContext context) {
    return Container(
      margin: EdgeInsets.symmetric(
          horizontal: ThemeSize.width9, vertical: ThemeSize.height6),
      padding: EdgeInsets.only(
          left: ThemeSize.width19,
          right: ThemeSize.width19,
          top: ThemeSize.width19,
          bottom: ThemeSize.height8),
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(ThemeSize.height8),
        color: ThemeColor.colorWhite,
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text("积分点亮勋章",
              style: TextStyle(
                  color: ThemeColor.color333333,
                  fontSize: ThemeSize.sp16,
                  fontWeight: FontWeight.bold)),
            ListView.builder(
            itemBuilder: (BuildContext context, int index) {
              return Container(
                padding: EdgeInsets.symmetric(vertical: ThemeSize.height12),
                child: Row(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Container(
                      child: Image.network(
                          "https://flutter.github.io/assets-for-api-docs/assets/widgets/owl-2.jpg",
                          height: ThemeSize.height22,
                          width: ThemeSize.height22,
                          fit: BoxFit.cover),
                      margin: EdgeInsets.only(right: ThemeSize.width5),
                    ),
                    Expanded(
                        child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text(
                          "满腹经纶",
                          style: TextStyle(
                              color: ThemeColor.color333333,
                              fontSize: ThemeSize.sp14,
                              height: 1.0),
                        ),
                        Container(
                          margin: EdgeInsets.only(top: ThemeSize.height6),
                          child: Text(
                            "累计150积分自动点亮",
                            style: TextStyle(
                                color: ThemeColor.color808080,
                                fontSize: ThemeSize.sp12),
                          ),
                        )
                      ],
                    )),
                    (index == 0)
                        ? Container(
                            alignment: Alignment.center,
                            height: ThemeSize.height26,
                            width: ThemeSize.width65,
                            decoration: BoxDecoration(
                                color: ThemeColor.colorFA5151,
                                borderRadius:
                                    BorderRadius.circular(ThemeSize.height12)),
                            child: Text(
                              "已点亮",
                              style: TextStyle(
                                  color: ThemeColor.colorWhite,
                                  fontSize: ThemeSize.sp13),
                            ),
                          )
                        : Container(
                            alignment: Alignment.center,
                            height: ThemeSize.height26,
                            width: ThemeSize.width65,
                            decoration: BoxDecoration(
                                color: ThemeColor.colorF2F2F2,
                                borderRadius:
                                    BorderRadius.circular(ThemeSize.height12)),
                            child: Text(
                              "待点亮",
                              style: TextStyle(
                                  color: ThemeColor.colorWhite,
                                  fontSize: ThemeSize.sp13),
                            ),
                          )
                  ],
                ),
              );
            },
            itemCount: 4,
            physics: NeverScrollableScrollPhysics(),
            shrinkWrap: true,
          )
        ],
      ),
    );
  }
}
